export default {
  methods: {
    layoutGetList() {
      let xfields = this.getXMeta('xcomponents')||[]
      let ret = [[]]
      const max = 12
      let total = 0
      xfields.forEach((v,i)=>{
        v._index = i
        v._span = v._span||3
        if(total+v._span>max) {
          ret.push([])
          total = 0
        }
        ret[ret.length-1].push(v)
        total += v._span
      })

      let gutter = this.getXMeta('gutter')
      if(gutter) {
        ret.slice(0,ret.length-1).forEach(v=>{
          v._gutter = gutter
        })
      }
      return ret
    },
    layoutRowGetClass(v) {

    },
    layoutRowGetStyle(v) {
      let justify = this.getXMeta('justify')
      if(justify == 'end' || justify == 'start') justify = 'flex-' + justify
      if(justify == 'around' || justify == 'between') justify = 'space-' + justify
      let align =  this.getXMeta('align')
      if (align == 'top') align = 'flex-start'
      if (align == 'bottom') align = 'flex-end'
      return {
        paddingBottom: v._gutter?`${v._gutter}rpx`:'',
        alignItems: justify,
        justifyContent: align,
      }
    },
    layoutColGetClass(v) {
      return 'u-col-' + v._span
    },
    layoutColGetStyle(v) {
      let gutter = this.getXMeta('gutter')
      let offset = v._offset
      let span = v._span
      let textAlign = v._textAlign

      let justify = v._justify
      if(justify == 'end' || justify == 'start') justify = 'flex-' + justify
      if(justify == 'around' || justify == 'between') justify = 'space-' + justify
      let align =  v._align
      if (align == 'top') align = 'flex-start'
      if (align == 'bottom') align = 'flex-end'

      return {
        padding: `0 ${Number(gutter)/2 + 'rpx'}`,
        marginLeft: 100 / 12 * offset + '%',
        flex: `0 0 ${100 / 12 * span}%`,
        alignItems: align,
        justifyContent: justify,
        textAlign: textAlign
      }
    }
  }
}